<!--
 * @Description: 
 * @Version: 2.0
 * @Author: chengxin
 * @Date: 2022-12-16 11:03:21
 * @LastEditors: chengxin
 * @LastEditTime: 2022-12-16 16:49:40
-->
<template>
    <div class="home">
        <Luckdraw
        class="luckdraw"
        :prizes="prizes"
        :selectIndex="selectIndex"
        ></Luckdraw>
    </div>
</template>

<script setup>
import Luckdraw from '@/components/luckdraw.vue'
import { reactive, ref } from 'vue';
let prizes=reactive( [
    { background: '#1885b4',fonts: [{ top:'10%', text: '谢谢惠顾' }] },
    { background: '#fffeb0',fonts: [{ top:'10%', text: '1元红包' }] },
    { background: '#1885b4',fonts: [{ top:'10%', text: '10元红包' }] },
    { background: '#fffeb0',fonts: [{ top:'10%', text: '100元红包' }] },
    { background: '#1885b4',fonts: [{ top:'10%', text: '再来一次' }] },
    { background: '#fffeb0',fonts: [{ top:'10%', text: '包包一个' }] },
    { background: '#1885b4',fonts: [{ top:'10%', text: '服饰任选' }] },
    { background: '#fffeb0',fonts: [{ top:'10%', text: '出门旅游' }] },
])
let selectIndex=1
</script>

<style lang="less" scoped>
.home{
    width: 100%;
    height: 100vh;
    background: url('../../assets/images/bg1.png') no-repeat center center;
    background-size: 100% 100%;
    position: relative;
    .luckdraw{
        position: absolute;
        right: 30%;
        top: 20%;
    }
}
</style>
